<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script>
    function $(id) {
        return document.getElementById(id);
    }
    function findByItem(pg) {
        $("pageNO").value = pg;
        $("f1").submit();
    }

</script>
<body>
<div th:if="${session.loginUser==null}">
    请先<a href="login.html">登陆</a>
</div>

<div th:if="${page!=null}">
    <div th:if="session.loginUser!=null">
        <span th:text="'欢迎光临!   '+${session.loginUser.uniName}"></span>
    </div>

    <div style="display: flex" th:if="${page!=null}">
        <div style="width: 300px;width: 300px" th:each="p:${page.records}">
            <img th:src="'/images/'+${p.image}" width="200" height="200"><br>

            商品名：<span th:text="${p.name}"></span><br>
            单价：<span th:text="'￥'+${p.price}"></span><br>
            评论：<span th:text="${p.comNum}+'条'"></span><br>
            <a th:href="@{/product/findById(id=${p.id})}">查看</a>
        </div>

    </div>
    <div>
        <a style="margin-left: 10px" th:each="i:${#numbers.sequence(1,page.pages)}" th:text="${i}"
           th:href="'javascript:findByItem('+${i}+')'"></a>
    </div>
</div>


<form action="/product/findByItem" id="f1">
    <input type="hidden" name="pageNO" id="pageNO">
    商品名 <input type="text" name="name" th:value="${name}">
    <input type="submit" value="查找">
</form>

</body>
</html>